<script setup lang="ts">
import { ElButton, ElDialog } from 'element-plus'
import { ref } from 'vue'

const visible = ref(false)
// 打开
function show() {
    visible.value = true
}
// 关闭
function hide() {
    visible.value = false
}
defineExpose({
    show,
})
</script>

<template>
    <ElDialog v-model="visible"
              title="关闭订单"
              style="font-size:20px;font-weight:600;"
              width="30%"
    >
        <p style="font-size:20px;font-weight:400;text-align:center">
            确定关闭此订单吗？
        </p>

        <template #footer>
            <div class="dialog-footer">
                <ElButton color="#DA0004"
                          @click="hide()"
                >
                    确认关闭
                </ElButton>

                <ElButton @click="hide()">
                    取消
                </ElButton>
            </div>
        </template>
    </ElDialog>
</template>

<style lang="scss" scoped>
</style>
